import React from "react";
import {Icon, Layout} from "antd";
import SiderMenu from "@/components/SiderMenu";
import {mapIndexSider} from "@/store/index/connect";
import {connect} from "react-redux";
const { Sider } = Layout;


class MySider extends React.Component{

    toggleCollapsed = () => {
        this.props.toggleCollapsed();
    }

    render() {
        return (
            <Sider trigger={null}
                   collapsible
                   collapsed={this.props.collapsed}
                   className="aside"
                   collapsedWidth={24}
            >
                <SiderMenu/>
                <Icon type={this.props.collapsed ? 'menu-unfold' : 'menu-fold'}
                      onClick={this.toggleCollapsed}
                      className="trigger"
                />
            </Sider>
        );
    }

}
export default connect(mapIndexSider.mapStateToProps, mapIndexSider.mapDispatchToProps)(MySider);
